<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>可生成环形文字的纯js插件|DEMO_jQuery之家-自由分享jQuery、html5、css3的插件库</title>
<style type="text/css">
	html,
	body {
	  height: 100%;
	  margin: 0;
	  overflow: hidden;
	  background: #FFFCEC;
	  background:url(../example.jpeg) top left no-repeat;
	  font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;
	}

	.emblem {
	  position: absolute;
	  left: 0;
	  right: 0;
	  top: 25vh;
	  margin: 0 auto;
	  width: 50vh;
	  height: 50vh;
	  border-radius: 50%;
	  font-weight: bold;
	  color: #003A6F;
	  animation: spinZ 20s linear infinite;
	  text-align: center;
	}
	.emblem span {
	  position: absolute;
	  display: inline-block;
	  left: 0;
	  right: 0;
	  top: 0;
	  bottom: 0;
	  text-transform: uppercase;
	  font-size: 4vh;
	  transition: all 0.5s cubic-bezier(0, 0, 0, 1);
	}
	@keyframes spinZ {
	  0% {
		transform: rotateZ(360deg);
	  }
	  100% {
		transform: rotateZ(0deg);
	  }
	}
</style>

</head>
<body>

<div class="emblem">亲亲寒冰*Love.Han.Bing*</div>

<script type="text/javascript" src="js/emblem.js"></script>
<script type="text/javascript">
	Emblem.init('.emblem');
</script>


</body>
</html>